<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>vue</title>
    <link rel="stylesheet" type="text/css" href="./css/api.css" />
    <link rel="stylesheet" type="text/css" href="./css/style.css" />
  </head>
  <body>
    <header ></header>
    <div id="app"></div>
    <!-- built files will be auto injected -->
  </body>
</html>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/nativeJs/custom.js"></script>
<script type="text/javascript">
    apiready = function(){
        var header = $api.dom('header') 
        $api.fixStatusBar(header);
        var staH = $api.offset(header).h
        //loader调试时候可以注释下一行，但打包时候切记必须使用--statusBar，否则会被状态栏遮挡布局
        //api的webview机制还是没完全弄清楚
        document.body.style.setProperty("--statusBar",staH);
        api.setStatusBarStyle({
            style: 'dark',
            color: '#f1efef'
        });
        // 通知vue可以使用api能力
        window.apiReady(true);
    };
</script> 